{php}
$chartId = 'g_'.uniqid();
$this->_tpl_vars['chart_id'] = $chartId;
{/php}
<form id='{$form.name}' name='{$form.name}'>
{literal}
<style>
#main #right_panel .content table.input_row td .label_text{
width:350px;
}
.action_panel{
width:310px;
}
.search_panel{
width:380px;
}
.search_panel select{
float:left;
margin-right:5px;
}
</style>
{/literal}
<div style="padding-left:25px;padding-right:40px;padding-top:0px;">
 

<div style="width:700px; height:500px; position:relative;" id="GanttDiv"></div>

<script>
formname = '{$form.name}';

var ganttChartControl;
function createChartControl(htmlDiv1)
{literal}
{
{/literal}
     
    // Create Gantt control
    ganttChartControl = new GanttChart();
    // Setup paths and behavior
    ganttChartControl.setImagePath("{php}echo RESOURCE_URL;{/php}/collab/js/jsgantt/imgs/");
    ganttChartControl.setStylePath("{php}echo RESOURCE_URL;{/php}/collab/js/jsgantt/dhtmlxgantt.css");
    ganttChartControl.setEditable(true);
    ganttChartControl.showTreePanel(true);
    ganttChartControl.showContextMenu(false);
    ganttChartControl.showDescTask(true,'d,s-f');
    ganttChartControl.showDescProject(true,'d');
    // Load data structure        
    ganttChartControl.create(htmlDiv1);
    
    {literal}
    ganttChartControl.attachEvent("onTaskEndDrag", function(task){        
    	taskId = task.getId();    	
    	start_time = task.getEST().getTime()/1000;
    	duration = task.getDuration();
    	move_child = task.moveChild;
    	Openbiz.getFormObject('{/literal}{$form.name}{literal}').selectedId = taskId;
    	Openbiz.getFormObject('{/literal}{$form.name}{literal}').start_time = start_time;
    	Openbiz.getFormObject('{/literal}{$form.name}{literal}').duration = duration;
    	Openbiz.getFormObject('{/literal}{$form.name}{literal}').move_child = move_child;
    	Openbiz.CallFunction('{/literal}{$form.name}{literal}.SelectRecord('+taskId+')');
    	Openbiz.CallFunction('{/literal}{$form.name}{literal}.UpdateTaskTime()',{'type':'','target':'','evthdl':'btn_update_time:btn_update_time_onchange'});
         
    });
    ganttChartControl.attachEvent("onTaskEndResize", function(task){        
    	taskId = task.getId();
    	start_time = task.getEST().getTime()/1000;
    	duration = task.getDuration();    	
    	Openbiz.getFormObject('{/literal}{$form.name}{literal}').selectedId = taskId;
    	Openbiz.getFormObject('{/literal}{$form.name}{literal}').start_time = start_time;
    	Openbiz.getFormObject('{/literal}{$form.name}{literal}').duration = duration;
    	Openbiz.CallFunction('{/literal}{$form.name}{literal}.SelectRecord('+taskId+')');
    	Openbiz.CallFunction('{/literal}{$form.name}{literal}.UpdateTaskTime()',{'type':'','target':'','evthdl':'btn_update_time:btn_update_time_onchange'});
        
  	});
    ganttChartControl.attachEvent("onTaskClick", function(task){   
    		{/literal}			
			form_name = '{$form.name}';
			{literal}			
			taskId = task.getId();
			if(prev_selectedId = Openbiz.getFormObject(form_name).selectedItem)
			{
				$j("#task_"+prev_selectedId).each(function(i){
					this.style.border='1px solid #6589A9';
					this.style.borderLeft='1px solid #6589A9';
					}); 
			}
			$j("#task_"+taskId).each(function(i){ 				
				this.style.border='1px solid #ff0000';
				this.style.borderLeft='3px solid #ff0000';
				}); 
			Openbiz.getFormObject(form_name).selectedItem =  taskId;
			Openbiz.CallFunction('{/literal}{$form.name}{literal}.SelectRecord('+taskId+')');	
       		//alert("Task with Id = " + task.getId() + " is clicked.");
  	});
    ganttChartControl.attachEvent("onTaskDblClick", function(task){   
		{/literal}			
		form_name = '{$form.name}';
		{literal}			
		taskId = task.getId();		
		Openbiz.CallFunction('{/literal}{$form.name}{literal}.SelectRecord('+taskId+')');	
		Openbiz.CallFunction('{/literal}{$form.name}{literal}.EditRecord()',{'type':'','target':'','evthdl':'btn_detail:btn_detail_onclick'});
	});

   	
   	{/literal}
 	ganttChartControl.loadData("{$app_url}/bin/controller.php?F=RPCInvoke&P0=["+formname+"]&P1=[renderGantt]&__this=btn_render_gantt:btn_render_gantt_onclick&",true,true);
    // Build control on the page
    {if $smarty.get.__this eq 'btn_print:print_onclick' }    
    ganttChartControl.printToWindow();
    {/if}
{literal}
}   
{/literal}
setTimeout("createChartControl('GanttDiv');",500);

</script>
<!-- status switch  -->
<script>
{if $form.status eq 'Enabled'}
{elseif $form.status eq 'Disabled'}
$('{$form.name}_data_table').fade({literal}{ duration: 0.5, from: 1, to: 0.35 }{/literal});
{/if}
</script>
<span id='{$form.name}_selected_id' style="display:none">{$default_selected_id}</span>
<!-- table end -->	

{if  $actionPanel }	
	<div class="form_header_panel">	
		<div class="action_panel"  style="width:688px;">
		{foreach item=elem from=$actionPanel}
		    	{$elem.element}
		{/foreach}
		</div>
	</div>	
{/if}	
	<div class="v_spacer"></div>
</div>
</form>